<!--
 * @Description: 取消预约弹窗
 * @Autor: 何兴家
 * @Date: 2020-12-02 10:35:16
 * @LastEditors: 何兴家
 * @LastEditTime: 2020-12-02 11:21:08
-->
<template>
  <div>
    <FormPanel ref="formPanel" :list="formList" :labelWidth="100" :isSubmitBtn="false" :cols="2"></FormPanel>
    <div class="btnWrap">
      <el-button type="primary" @click="handleComfirm">确定</el-button>
      <el-button @click="handleCancel">取消</el-button>
    </div>
  </div>
</template>

<script>
import { dictionary } from '@/utils/dictMixin';
import { confirmAction, notifyAction } from '@/utils';

import { cancelBookingOrderWithReason } from '@/api/repair/repairReception/precontractStatus';

export default {
  props: ['bookingOrderNo'],
  mixins: [dictionary],
  data() {
    return {
      formList: this.createFormList()
    };
  },
  methods: {
    createFormList() {
      return [
        {
          type: 'SELECT',
          label: '取消预约发起',
          fieldName: 'canclePerson',
          itemList: [
            { text: '客户', value: '客户' },
            { text: '经销商', value: '经销商' }
          ],
          initialValue: '客户',
          rules: [{ required: true, message: '请输入取消预约发起方', trigger: 'blur' }]
        },
        {
          type: 'INPUT',
          label: '取消预约原因',
          fieldName: 'cancleReason',
          selfCols: 2,
          rules: [{ required: true, message: '请输入取消预约原因', trigger: 'blur' }]
        }
      ];
    },
    // 点击确定
    async handleComfirm() {
      let formData = await this.$refs.formPanel.GET_FORM_DATA();
      if (formData[0]) return;
      let res = await cancelBookingOrderWithReason({ bookingOrderNo: this.bookingOrderNo, ...formData[1] });
      if (res.resultCode == 200) {
        notifyAction('取消预约成功', 'success');
        this.refeshTableData;
        this.$emit('refesh');
        this.$emit('close');
      }
    },
    // 点击取消
    handleCancel() {
      this.$emit('close');
    }
  }
};
</script>

<style scoped>
.btnWrap {
  position: absolute;
  left: 0px;
  bottom: 0px;
  right: 0px;
  z-index: 9;
  border-top: 1px solid rgb(233, 233, 233);
  padding: 10px 20px;
  background: rgb(255, 255, 255);
  text-align: right;
}
</style>
